<template>
    <a-modal
            :title="title"
            :width="width"
            :visible="visible"
            :confirmLoading="confirmLoading"
            @ok="handleOk"
            @cancel="handleCancel"
            cancelText="关闭">
        <a-spin :spinning="confirmLoading">
            <a-table :columns="columns" :dataSource="data" :pagination="false"
                     size="middle">
                <template v-for="(col, i) in ['placeName','entryTime', 'entryReason',
'status']" :slot="col"
                          slot-scope="text, record, index">
                    <a-tooltip :defaultVisible="false">
                        <a-input :key="col" v-if="record.editable" style="margin: -5px 0"
                                 :value="text"
                                 :placeholder="columns[i].title"/>
                        <template v-else>{{ text }}</template>
                    </a-tooltip>
                </template>
            </a-table>
        </a-spin>
    </a-modal>
</template>
<script>
    import {httpAction, getAction} from '@/api/manage'
    import pick from 'lodash.pick'
    import {validateDuplicateValue} from '@/utils/util'
    import JDictSelectTag from "@/components/dict/JDictSelectTag"
    export default {
        name: "SdxcReserveUserModal",
        components: {
            JDictSelectTag,
        },
        data() {
            return {
                form: this.$form.createForm(this),
                title: "操作",
                width: 1000,
                visible: false,
                model: {},
                labelCol: {
                    xs: {span: 24},
                    sm: {span: 5},
                },
                wrapperCol: {
                    xs: {span: 24},
                    sm: {span: 16},
                },
                confirmLoading: false,
                columns: [
                    {
                        title: '预约场地',
                        dataIndex: 'placeName',
                        key: 'placeName',
                        width: '25%',
                        scopedSlots: {customRender: 'placeName'}
                    },
                    {
                        title: '预约入场时间',
                        dataIndex: 'entryTime',
                        key: 'entryTime',
                        width: '25%',
                        scopedSlots: {customRender: 'entryTime'}
                    },
                    {
                        title: '入场事由',
                        dataIndex: 'entryReason',
                        key: 'entryReason',
                        width: '18%',
                        scopedSlots: {customRender: 'entryReason'}
                    },
                    {
                        title: '状态',
                        dataIndex: 'status',
                        key: 'status',
                        width: '16%',
                        scopedSlots: {customRender: 'status'}
                    },
                ],
                data: [],
                url: {
                    queryReserveListByUserId:
                        "/reserve/sdxcReserveUser/queryReserveListByUserId",
                }
            }
        },
        created() {
        },
        methods: {
// 根据用户id查询预约记录列表
            edit(record) {
                this.data = [];
                this.form.resetFields();
                this.model = Object.assign({}, record);
                this.visible = true;
                if (this.model.id) {
                    let params = {id: this.model.id};
//初始化测试方法列表
                    getAction(this.url.queryReserveListByUserId, params).then((res) => {
                        if (res.success) {
                            var key = 1;
                            res.result.forEach(reserve => {
                                var method = {
                                    key: (key++) + "",
                                    editable: false,
                                    placeName: reserve.placeName,
                                    entryTime: reserve.entryTime,
                                    entryReason: reserve.entryReason,
                                    healthUrl: reserve.healthUrl,
                                    status: reserve.status === 1 ? "审核通过" : (reserve.status ===
                                    2 ? "审核中" : "审核不通过"),
                                }
                                this.data.push(method);
                            });
                            this.$forceUpdate()
                        }
                    })
                }
            },
            close() {
                this.$emit('close');
                this.visible = false;
            },
            handleOk() {
                this.close()
            },
            handleCancel() {
                this.close()
            },
        }
    }
</script>
